<template>
  <div class="test-results">
    <div 
      v-for="result in results" 
      :key="result.id" 
      class="test-case" 
      :class="result.status"
    >
      <h3>
        {{ result.title }}
        <span class="status">{{ result.status === 'passed' ? '通过' : '失败' }}</span>
      </h3>
      <p>{{ result.description }}</p>
      <p style="opacity: 0.8; font-size: 0.9rem;">{{ result.details }}</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'TestResults',
  props: {
    results: {
      type: Array,
      required: true
    }
  }
}
</script>

<style scoped>
/* Styles are inherited from parent */
</style>